<!DOCTYPE html>
<html>
<head>
<title>BoozeDotWa PriceFinder</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
 	<!-- let's just stick with stable versions for now -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script src="jqcalc.js"></script>
<link rel="stylesheet" href="default.css" />
</head>
<body>



<div data-role="page" id="calculator" data-theme="a">

	<div data-role="header" data-theme="a">
	<h1><img class="dsR12" src="title.png" alt="BoozeDotWa"></h1>
	<h1>BoozeDotWa: Calculator</h1>
	</div><!-- /header -->

<div data-role="content">
	

   <form onchange="page.submit();" action="jqcalc.js">


	
	<div data-role="fieldcontain">
	<input type="hidden" name="ssTax" id="ssTax" value="0.205" />
	</div>

	<div data-role="fieldcontain">
	<input type="hidden" name="slTax" id="slTax" value="3.7708" />
	</div>
	
<!--  still no decimal point on keypad android 2.2! -->
<div data-role="fieldcontain"> 
	<label for="shelfPrice" class="price_label">What's the shelf price?</label>
	<input type="number" name="shelfPrice" id="shelfPrice"  
	required="required" placeholder="say, $12.99?" min="0.01" step="0.01" 
	size="8" class="boozeField" />
	</div> 




<div data-role="fieldcontain">

    <label for="bottleSize" class="bottle_label">What size bottle?</label>
	<select name="bottleSize" id="bottleSize"
	onchange="page.submit()" onclick="page.submit()">
        <option value="0.750" selected="selected">750ml (Fifth)</option>
        <option value="1.75">1.75L (Half Gallon)</option>
        <option value="0.050">50ml (Airplane bottle)</option>
        <option value="0.375">375ml (Pint)</option>
        <option value="1.00">1L (Liter)</option>
        <option value="0.400">400ml (Hard to find)</option>
        <option value="0.900" />900ml (Uncommon)</option>
	</select><!-- /select -->

</div>

<div data-role="fieldcontain">
  <label for="boozeTakehome" class="takehome_label">You will pay:</label>
  <input type="text" name="boozeTakehome" id="boozeTakehome" class="boozeAnswer">
</div>


	<!--  fieldset class="ui-grid-a" -->
<!-- div class="ui-body ui-body-a" -->
	<!-- div class="ui-block-a"><button type="submit" data-theme="a">Reset</button></div>
	<div class="ui-block-a"><button type="submit" data-theme="f">Save</button></div>
	</fieldset>
	</div -->        

</form> 

<a href="#wa-liquor-legal" data-role="button" data-rel="dialog" data-transition="pop" data-inline="true">How does this work?</a>


	</div><!-- /content -->


	<div data-role="footer"><h4></h4></div> 
 
	
</div><!-- /page  id calculator -->


<!-- start of second page -->
<div data-role="page" id="wa-liquor-legal" data-title="Legal Malarkey" data-theme="a">

	<div data-role="header" data-theme="a">
        <h1><img class="dsR12" 
	src="title.png" 
	alt="BoozeDotWa"></h1> 
	<h1>BoozeDotWa: How does this work?</h1>
	</div><!-- /header -->

	<div data-role="content">
	<p>
		Retail stores in Washington State are 
		only required to post the pre-tax price of liquor.  Use the 
		calculator above to figure out how much your booze will really 
		cost.</p>
	<span class="ds13">There are two types of spirits taxes: </span>
j
		<span class="ds14">Spirits Sales Tax (SST):</span>
		<p>This tax is based on the selling price 
		of spirits in their original package.  Spirits sales tax rate 
		paid by the general public: 20.5%.</p>

		<span class="ds14">Spirits Liter Tax (SLT):</span>
		<p>This tax is based on the volume of the 
		spirits being sold in the original package. Spirits liter tax 
		rate paid by the general public: $3.7708 per liter.</p>
											
												
		<a href="#calculator"data-role="button" data-rel="back" data-theme="c">Bastards.</a>


	</div><!-- /content -->

	<div data-role="footer"><h4></h4></div> 

</div><!-- /page wa-liquor-legal -->




<script type="text/javascript">

// $("#boozeCalc").click(function(){ 
// what you have to do here
// is to abstract the calculation into its own named function
// and then hit that on a bottleSize.change 
// and/or a shelfprice blur
// so it gets calculated when user moves between these fields
// then the submit button should transition to a save page
// it should be a save button
// 
//
// okay fuck... the calculation works on the VTAB but no decimal
//
// looks good style-wise
//
// need to do $ currency formatting adds. and more styling
//
$("#bottleSize, #shelfPrice").change(function(){ 
	var SZ,SP,slt,sst; 
	SP = parseFloat($("#shelfPrice").val()); // shelf price
	SZ = parseFloat($("#bottleSize").val()); // bottle size 
	slt = parseFloat($("#slTax").val()); // Spirit Liter Tax
	sst = parseFloat($("#ssTax").val()); // Spirit Sales Tax

	TP = ( ( SP * sst ) + ( ( SZ * slt ) + SP ) ) ; 
	// math to make the TakehomePrice #boozeTakehome
	// take_home_price = ( ( shelf_price * spirit_sales_tax ) + ( ( bottleSize * sprit_liter_tax ) + shelf_price ) ) ;

	PPL = TP / SZ ; // math to make the PricePerLiter #boozePPL
		//	price_per_liter = take_home_price / bottleSize ;



if(!isNaN(TP)) 
{ 
$("#boozeTakehome").val(TP.toFixed(2)); 
} 
else 
{ 
$("#boozeTakehome").val('There was an error'); 
} 
return false; 
}); 

</script>





</body>
</html>
